<!--
 * @Author: @yzcheng
 * @Date: 2021-03-01 11:12:00
 * @Version: 1.0
 * @LastEditors: @yzcheng
 * @Description: 
 * @LastEditTime: 2021-03-19 16:20:10
-->
<template>
  <el-dialog
    :title="'详情'"
    destroy-on-close
    @close="close"
    :model-value="visible"
  >
    <el-form ref="form" size="small" label-width="80px">
      <el-row gutter="30">
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'加班人'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'申请单号'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'经办人'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'所属部门'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'申请日期'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="22">
          <el-form-item prop="flowName" label-width="19%" :label="'加班地点'">
            <el-input disabled type="textarea"></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="22">
          <el-form-item prop="flowName" label-width="19%" :label="'加班事项'">
            <el-input disabled type="textarea"></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="22">
          <el-form-item prop="flowName" label-width="19%" :label="'未完成原因'">
            <el-input disabled type="textarea"></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="22">
          <el-form-item prop="flowName" label-width="19%" :label="'备注'">
            <el-input disabled type="textarea"></el-input>
          </el-form-item>
        </el-col>
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'加班人'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="11">
          <el-form-item label-width="40%" :label="'加班人'">
            <el-input disabled />
          </el-form-item>
        </el-col>
        <el-col :xl="22">
          <el-form-item label-width="19.5%" :label="'加班人'">
            <el-input disabled> </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </el-dialog>
</template>

<script>
import { mapState } from "vuex";
export default {
  props: {
    visible: {
      type: Boolean,
      default: function () {
        return false;
      },
    },
  },
  emits: ["update:visible"],
  data() {
    return {
      rules: [],
      type: "",
      filterText: "",
      defaultProps: {
        children: "children",
        label: "name",
      },
    };
  },
  computed: {
    ...mapState("readingStore", ["form"]),
  },
  methods: {
    close() {
      this.$emit("update:visible", false);
    },
  },
};
</script>

<style lang="scss" scoped>
.define_form_class,
.define_content {
  padding: 0 20px;
}
.define_content {
  overflow: auto;
  min-height: 300px;
}
.define_footer {
  display: flex;
  justify-content: space-around;
}
</style>
<style  >
.define_form_class .el-input {
  width: 90%;
}
</style>